<template>
  <div>
    <h3>默认插槽</h3>
    <HmDialog>
      <!-- <p>slot真的好简单啊</p> -->
      <!-- 多个slot使用的时候利用template标签结合v-slot -->

      <!-- 多个插槽叫 具名插槽 -->
      <template #header>
        <h3>我是个牛逼的标题</h3>
      </template>
      <!-- 传递数据使用的叫作用域插槽 -->
      <template #main="obj">  
        <p>{{obj.content}}</p>
      </template>

      <template #footer="{ yes, no}" >
        <button>{{yes}}</button>
        <button>{{no}}</button>
      </template>
    </HmDialog>
  </div>
</template>

<script>
import HmDialog from './components/HmDialog.vue'

export default {
  components: {
    HmDialog
  }
}
</script>

<style>

</style>